<div class="container">
      <!-- Brand and toggle get grouped for better mobile display -->
  <div class="navbar-header">
    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
      <span class="sr-only">Toggle navigation</span>
      <i class="icon-three-bars"></i>
    </button>
  </div>

  <!-- Collect the nav links, forms, and other content for toggling -->
  <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
    <ul class="nav navbar-nav">
      <li ng-class="{'dropdown':item.hasChild,'active':item.active}" ng-repeat="item in NavItems">
      <a ng-if="!item.hasChild" href="{{item.href}}">{{item.label}}</a>
      <a ng-if="item.hasChild" href="{{item.href}}" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">{{item.label}}<span class="caret"></span></a>
        <ul ng-if="item.hasChild" class="dropdown-menu" role="menu">
          <li ng-repeat="childItem in item.childItems"><a href="{{childItem.href}}">{{item.childItem}}</a></li>
        </ul>
      </li>
    </ul>
  </div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->